<div class="rightcontent rc-bg-grey">
    <div class="rc-pagepadding">
        <div class=" rc-pannel ">
            <div class=" rc-pannel-header">
                <div class="rc-flex layui-form toolbar rc-flex-justify-between">
                    <div class=" rc-flex rc-flex-vertical-center ">
                    </div>
                    <div>
                        <a href="javascript:;" class="layui-btn layui-btn-primary layui-btn-sm" id="add"><i class="iconfont">&#xe60e;</i> 添加字典</a>
                    </div>
                </div>
            </div>

            <div class="rc-pannel-body layui-form rc-pagepadding ">
                <table class="layui-table">
                    <colgroup>
                        <col>
                        <col>
                        <col style="width: 240px;">
                    </colgroup>
                    <thead>
                        <tr>

                            <th>字典名</th>
                            <th>字典值</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php
                        foreach ($dicts as $dict) {
                        ?>
                            <tr>
                                <td><?php echo $dict->title ?></td>
                                <td>
                                    <?php
                                    $values = json_decode($dict->values, true);
                                    foreach ($values as $value) {
                                        echo '[' . $value['displayname'] . ' - ' . $value['realvalue'] . '] ';
                                    }
                                    ?>
                                </td>
                                <td>

                                    <div class="rc-opbar" style="width: 150px;margin-left:15px">
                                        <a class="info edit" dictid="<?php echo $dict->id ?>" href="javascript:;"> <i class="iconfont">&#xe643;</i> 编辑</a>
                                        <a dictid="<?php echo $dict->id ?>" class="info delete" href="javascript:;"> <i class="iconfont">&#xe607;</i> 删除</a>
                                    </div>

                                </td>
                            </tr>
                        <?php
                        } ?>
                    </tbody>

                </table>
            </div>
        </div>
    </div>
</div>

<script>
    layui.use(function() {
        var layer = layui.layer;
        $('#add').click(function() {
            layer.open({
                type: 2,
                offset: 'r',
                move: false,
                anim: 'slideLeft', // 从右往左
                area: ['600px', '100%'],
                shade: 0.1,
                title: '添加字典',
                id: 'ID-demo-layer-direction-r',
                content: '/admin/cnf/DataDict/add'
            });
        });


        $('.edit').click(function() {
            var dictid = $(this).attr('dictid');
            layer.open({
                type: 2,
                offset: 'r',
                move: false,
                anim: 'slideLeft', // 从右往左
                area: ['600px', '100%'],
                shade: 0.1,
                title: '编辑字典',
                id: 'ID-demo-layer-direction-r',
                content: '/admin/cnf/DataDict/edit?id=' + dictid
            });
        });

        $('.delete').click(function() {

            var dictid = $(this).attr('dictid');
            layer.confirm('确定要删除么？', {
                icon: 3
            }, function() {
                $.ajax({
                    url: '/admin/cnf/Datadict/delete?id=' + dictid, //请求路径
                    type: "POST", //请求方式
                    success: function(data) {
                        if (data.code == 0) {
                            window.location.reload();
                        } else {
                            toastr_error(data.message);
                        }
                        layer.closeAll();
                    },
                    error: function() {
                        layer.closeAll();
                    },

                });


            }, function() {



            });

        });


    });
</script>